<template>
  <!-- 组件的结构，有且只有一个div根元素 -->
  <div>
     <div>{{num}}</div>
     <div>我是{{obj.uname}}</div>
     <div>今年{{obj.age}}</div>
     <div>我的爱好是{{obj.age/3>10?obj.hobby2[0]:obj.hobby[0]}}</div>
   </div>
</template>
 
<script>
// vue组件的核心配置项
export default {
  // data就是我们vue组件的数据源
  data() {
    return {
      num: 20,
      obj: {
        uname: 'ikun',
        age: 33,
        hobby: ['唱', '跳', 'rap'],
        hobby2:['抽','喝','烫']
      }
    };
  },
  
};
</script>

<style scoped>
     
</style>